<template>
  <div>
    <van-nav-bar @click-left="$router.go(-1)" title="设置密码">
      <template #left>
        <van-icon name="arrow-left" @click="$router.go(-1)" />
      </template>
    </van-nav-bar>
    <div>
      <van-form>
        <div>
          <van-field
            v-model="parmas.mobile"
            center
            clearable
            placeholder="请输入手机号"
          >
            <template #button>
              <van-button size="small" @click="push">{{ value }}</van-button>
            </template>
          </van-field>
          <van-field
            v-model="parmas.sms_code"
            type="text"
            placeholder="请输入短信验证码"
            :rules="[{ required: true, message: '请填写短信验证码' }]"
          />
          <van-field
            v-model="parmas.password"
            type="password"
            placeholder="请输入密码"
            :rules="[{ required: true, message: '请填写密码' }]"
          />
        </div>

        <div style="margin: 16px; padding-top: 100px">
          <van-button
            round
            block
            type="danger"
            native-type="submit"
            @click="addlogin"
            >确定</van-button
          >
        </div>
      </van-form>
    </div>
  </div>
</template>

<script>
import { password, smsCode } from "../../request/http";
import { Toast } from "vant";
export default {
  data() {
    return {
      value: "发送验证码",
      time: null,
      parmas: {
        mobile: "",
        password: "",
        sms_code: "",
        type: 2,
        sms_type: "login",
      },
    };
  },
  methods: {
    push() {
      smsCode(this.parmas).then((res) => {
        console.log(res);
        let num = 60;
        this.time = setInterval(() => {
          // debugger;
          num--;
          this.value = num + "s后重新发送";
          if (num <= 0) {
            clearInterval(this.time);
            this.value = "发送验证码";
            num = 60;
          }
        }, 1000);
        if (res.code == 200) {
          Toast.success("发送成功");
        }
      });
    },
    addlogin() {
      password(this.parmas).then((res) => {
        console.log(res);
        if (res.code == 200) {
          Toast.success("设置成功");
          this.$router.push("/login")
        }
      });
    },
  },
};
</script>

<style lang="scss" scoped>
</style>